<template>
  <div>
    <home-header></home-header>
    <home-swiper :list="swiperlist"></home-swiper>
    <home-icons :list="iconlist"></home-icons>
  </div>
</template>

<script>
import HomeHeader from "../components/Header"
import HomeSwiper from "../components/Swiper"
import HomeIcons from "../components/Icons"
import axios from 'axios'
export default {
  name: "Home",
  components: {
    HomeHeader,HomeSwiper,HomeIcons
  },
  data () {
    return {
      swiperlist:[],
      iconlist:[]
    }
  },
  mounted () {
    this.getHomeInfo();
  },
  methods:{
    getHomeInfo () {
      axios.get('/api/index.json')
        .then(this.getHomeInfoSucc)
    },
    getHomeInfoSucc (d) {
      var res=d.data.data
      this.swiperlist=res.swiperList
      this.iconlist=res.iconList
    }
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
